<template>
  <div class="router-content">
    <inside v-for="(div, index) in article" :key="index" :title="div.title" :contents="div.contents" :urls="div.urls"></inside>
  </div>
</template>

<script>
import Bus from '@/assets/bus'
import inside from '@/components/inside'
export default {
  name: 'index',
  components: {
    inside
  },
  data () {
    return {
      menus: [],
      article: []
    }
  },
  created () {
    this.menus = this.$route.matched
    Bus.$emit('menus', this.menus)
    // console.log(this.$route.matched)
    this.write()
  },
  methods: {
    write () {
      this.article = [
        {
          title: '添加员工',
          contents: [
            '进入员工列表，点击右上角的“添加员工”，如下图所示',
            '弹出编辑员工对话框，填写员工账号和姓名，性别、描述，点击提交，即可创建员工成功。'
          ],
          urls: [
            '/static/imgs/base/staff_1.png',
            '/static/imgs/base/staff_2.png'
          ]
        }, {
          title: '修改员工信息',
          contents: [
            '点击已经创建员工旁边的“查看”，如下图所示',
            '进入员工个人信息页面，如下图所示，点击右上角的“编辑”',
            '弹出编辑员工对话框，如下图所示，即可修改员工信息（账号一经创建不可修改）'
          ],
          urls: [
            '/static/imgs/base/staff_3.png',
            '/static/imgs/base/staff_4.png',
            '/static/imgs/base/staff_5.png'
          ]
        }, {
          title: '赋予食堂或者卡务中心权限',
          contents: [
            '在员工个人信息下面有权限设置，如下图所示',
            '点击右边的“添加权限范围”如下图所示，选择想要赋予权限的食堂或者卡务中心，点击确定，即可赋予权限。'
          ],
          urls: [
            '/static/imgs/base/staff_6.png',
            '/static/imgs/base/staff_7.png'
          ]
        }, {
          title: '授权',
          contents: [
            '点击授予该员工权限的食堂或者卡务中心旁边的“授权”按钮，',
            '弹出编辑权限对话框，如下图所示',
            '选择想要授予该员工的职能权限，点击确定，即可授予职能权限。'
          ],
          urls: [
            '/static/imgs/base/staff_8.png',
            '/static/imgs/base/staff_9.png'
          ]
        }, {
          title: '删除权限范围',
          contents: [
            '点击授予该员工权限的食堂或者卡务中心旁边的“删除”按钮，如下图所示',
            '弹出对话框，如下图所示',
            '点击确定，即可删除该权限范围。'
          ],
          urls: [
            '/static/imgs/base/staff_10.png',
            '/static/imgs/base/staff_11.png'
          ]
        }, {
          title: '停用员工',
          contents: [
            '在员工列表页面点击已经创建员工旁边的“停用”，如下图所示',
            '弹出对话框，点击确定，即可停用该员工，该员工账号已被锁定，无法登陆',
            '该员工状态显示已锁定，如下图所示'
          ],
          urls: [
            '/static/imgs/base/staff_12.png',
            '/static/imgs/base/staff_13.png',
            '/static/imgs/base/staff_14.png'
          ]
        }, {
          title: '密码重置',
          contents: [
            '如果员工忘记了账号密码，则可点密码重置重置新密码，如下图所示'
          ],
          urls: [
            '/static/imgs/base/staff_15.png'
          ]
        }, {
          title: '查找员工',
          contents: [
            '在员工列表页面，输入目标员工账号或者姓名点击旁边的“查询”按钮，都可以搜索到目标用户，如下图所示。'
          ],
          urls: [
            '/static/imgs/base/staff_16.png'
          ]
        }
      ]
    }
  }
}
</script>
<style>
</style>
